<template>
  <div class="box6">
    <p class="item_tit">{{title}}</p>
    <i class="i_top_left"></i>
    <i class="i_bottom_right"></i>
    <div class="con"><slot name="center"></slot></div>
  </div>
</template>

<script>
export default {
    props: {
      title: {
        type: String,
        default: '边框标题'
      }
    },
    data() {
      return {

      }
    }
}
</script>

<style lang="less" scoped>
.box6{width: 100%; box-sizing: border-box; box-shadow: 0px 0px 15px #2388a5 inset; position: relative; border: 1px solid #009e98; background: url(~@/assets/images/borderBox/box6/bg_btm.png) repeat;}
.box6 .item_tit{display: block;width: 464px; z-index: 3;  height: 99px; background: url(~@/assets/images/borderBox/box6/bg_tit5.png) no-repeat center center; position: absolute; top: -32px; left: 50%; margin-left: -232px; color:#00fff6; font-size: 21px; box-sizing: border-box; padding-top: 14px;padding-top: 14px\0;text-align: center;z-index: 0;}
.box6 .i_top_left{display: block; position: absolute; top: -2px; left: -2px; width: 15px; height: 15px; background: url(~@/assets/images/borderBox/box6/bor_top_left.png) no-repeat center center; z-index: 9;}
.box6 .i_bottom_right{display: block; position: absolute; bottom: -1px; right: -1px; width: 7px; height: 7px; background: url(~@/assets/images/borderBox/box6/bor_bottom_right.png) no-repeat center center;z-index: 9;}
.box6 .con{padding: 12px; padding-top: 35px; height: 100%;}
</style>